<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets" template="index.xhtml">
	<ui:define name="body">

		<script type="text/javascript">
			$(document).ready(function() {
				$(".submenu-active").removeClass('submenu-active');
				$("#role").addClass('submenu-active');
			});
		</script>
		<body>
		<html>
<f:view>
	<p:dialog id="canNotDeleteRoleId" header="Supression Role"
		widgetVar="canNotDeleteRoleWv" modal="false"
		visible="#{roleMB.showCanNotDeleteUserHasSuperRole}">
		<h:form>
			<div align="right">
				<h:outputLabel value="#{roleMB.alertWarningMessage}"></h:outputLabel>

				<p:commandButton id="canNotDeleteRole3344sId" value="Ok"
					oncomplete="canNotDeleteRoleWv.hide()" immediate="true" />
			</div>
		</h:form>
	</p:dialog>

	<!-- Start  of DelRole-->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<p:confirmDialog id="delRole"
		message="Vous êtes sur de vouloir supprimer se rôle ?"
		header="Supprimer un rôle" severity="alert" widgetVar="delRoleWv">
		<h:form>
			<p:outputPanel id="delRolePanel">
				<div align="right">
					<p:commandButton id="decline" value="Annuler"
						oncomplete="delRole.hide()" />
					<p:commandButton id="confirm" value="Supprimer"
						oncomplete="delRole.hide()" actionListener="#{roleMB.deleteRole}"
						update=":roleTreeTableForm:roleTreeTable :canNotDeleteRoleId" />
				</div>
			</p:outputPanel>
		</h:form>
	</p:confirmDialog>

	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- End Adding delRole -->



	<!-- Start  Adding Role Dialog -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<p:dialog id="addDialog" header="Ajouter un rôle"
		widgetVar="dlgAddRoleWv" style="font-size: 0.9em" height="550"
		width="550">
		<h:form id="addRoleForm">
			<h1>Rôle</h1>
			<h3>Création d'un rôle</h3>
			<h4>
				<h:outputText value="Nom du rôle" />
			</h4>
			<p:inputText size="40" value="#{roleMB.toBeAddedOrdEditedRole.nom}" />
			<br />

			<h4>
				<h:outputText value="Rattachement hiérarchique de ce rôle" />
			</h4>
			<p:selectOneMenu value="#{roleMB.selectedSuperRoleName}"
				editable="false" style="width: 270px" id="selectRolesNamesId">
				<f:selectItems value="#{roleMB.rolesNames}" />
			</p:selectOneMenu>
			<br></br>
			<p:commandButton value="Enregistrer" oncomplete="dlgAddRoleWv.hide()"
				actionListener="#{roleMB.addRole}"
				update=":roleTreeTableForm:roleTreeTable">


			</p:commandButton>
		</h:form>
	</p:dialog>
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- End Adding Role Dialog -->







	<!-- Start  Edit Role  -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<p:dialog id="editRole" header="Modifier  un rôle"
		widgetVar="editRoleWv" style="font-size: 0.9em" height="550"
		width="550">
		<h:form id="editRoleFormId">
			<h1>Rôle</h1>
			<h3>Edition d'un rôle</h3>
			<h4>
				<h:outputText value="Nom du rôle" />
			</h4>
			<p:inputText size="40" value="#{roleMB.selectedRole.nom}" />
			<br />

			<h4>
				<h:outputText value="Rattachement hiérarchique de ce rôle" />
			</h4>
			<p:selectOneMenu value="#{roleMB.selectedSuperRoleName}"
				editable="false" style="width: 270px">
				<f:selectItems value="#{roleMB.rolesNames}" />
			</p:selectOneMenu>
			<br></br>
			<p:commandButton value="Enregistrer Modification"
				oncomplete="editRoleWv.hide()" actionListener="#{roleMB.editRole}"
				update=":roleTreeTableForm:roleTreeTable">


			</p:commandButton>
		</h:form>
	</p:dialog>
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- ________________________ -->
	<!-- End Adding Edit Role  -->




	<h:form id="roleTreeTableForm">

		<h1>Hiérarchie des rôles</h1>
		<br></br>
		<br></br>
		<center>

			<p:treeTable value="#{roleMB.root}" var="roleTreeTableVar"
				binding="#{roleMB.treeTable}" id="roleTreeTable">
				<f:facet name="header">
					<center>
						<p:commandButton value="Réduire tout"
							icon="ui-icon-folder-collapsed" style="font-size: 0.9em"
							actionListener="#{roleMB.expandAll}"
							update=":roleTreeTableForm:roleTreeTable" />
						<p:spacer width="30px" />
						<p:commandButton value="Développer tout"
							icon="ui-icon-folder-open" style="font-size: 0.9em"
							actionListener="#{roleMB.collapseAll}"
							update=":roleTreeTableForm:roleTreeTable" />

						<p:spacer width="30px" />
						<p:commandButton value="Ajouter un role"
							oncomplete="dlgAddRoleWv.show()" icon="ui-icon-folder-open"
							style="font-size: 0.9em" />




					</center>
				</f:facet>

				<p:column style="width:150px">
					<f:facet name="header">  
                Nom de Role  
            </f:facet>
					<h:outputText value="#{roleTreeTableVar.nom}" />
				</p:column>

				<p:column style="width:100px">
					<f:facet name="header">  
                Id de role  
            </f:facet>
					<h:outputText value="#{roleTreeTableVar.id}" />
				</p:column>

				<p:column style="width:20px">
					<p:commandLink oncomplete="dlgAddRoleWv.show()" value="Ajouter"
						update=":addRoleForm:selectRolesNamesId">
						<f:setPropertyActionListener value="#{roleTreeTableVar}"
							target="#{roleMB.selectedRole}" />
					</p:commandLink>
					<p:commandLink oncomplete="delRoleWv.show()" value="Supprimer">
						<f:setPropertyActionListener value="#{roleTreeTableVar}"
							target="#{roleMB.selectedRole}" />
					</p:commandLink>
					<p:commandLink oncomplete="editRoleWv.show()" value="Modifier"
						update=":editRole">
						<f:setPropertyActionListener value="#{roleTreeTableVar}"
							target="#{roleMB.selectedRole}" />
					</p:commandLink>
				</p:column>
			</p:treeTable>


		</center>








	</h:form>
</f:view>


		</html>
		</body>
	</ui:define>
</ui:composition>